import React, { useEffect, useRef } from 'react'
import * as echarts from 'echarts';

function jiuyeRightTop() {

    const ref = useRef();

    useEffect(() => {
        var chartDom = ref.current;
        var myChart = echarts.init(chartDom);
        var option;

        option = {
            title: {

            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'shadow'
                }
            },
            legend: {
                textStyle: {
                    color: '#fff',
                },
            },
            grid: {
                left: '3%',
                bottom: '3%',
                containLabel: true
            },
            xAxis: {
                type: 'value',
                boundaryGap: [0, 0.01]
            },
            yAxis: {
                type: 'category',
                data: ['天津', '重庆', '江苏', '广东', '浙江', '上海', '北京']
            },
            series: [
                {
                    type: 'bar',
                    data: [1, 3, 4, 6, 8, 9, 11],
                    itemStyle: {
                        color: '#00C9D4',
                        barBorderRadius: [0, 50, 50, 0]
                    }
                }
            ]
        };

        option && myChart.setOption(option);

    }, [])

    return (
        <>
            <div className="biYeCity_1_1" ref={ref}>

            </div>
        </>

    )
}

export default jiuyeRightTop
